<!DOCTYPE html>
<html lang="ch">

	<head>
		<meta charset="utf-8" />
		<title>百度前端</title>
		<style>
			* {
				font-family: "微软雅黑";
			}
		</style>
		<script>
		</script>
	</head>
	<!--
	作者：819115696@qq.com
	时间：2016-06-21
	描述：百度前端任务1
-->

	<body>
		<div id="layer1">
			<h1>网站一级标题</h1>
			<nav>
				<ul>
					<li><a href="#">导航连接一</a></li>
					<li><a href="#">导航连接二</a></li>
					<li><a href="#">导航连接三</a></li>
					<li><a href="#">导航连接四</a></li>
				</ul>
			</nav>

		</div>
		<div id="layer2">
			<div class="passage">
				<h2>文章一级标题</h2>
				<h2>文章二级标题</h2>
				<p>文章作者 文章发表时间</p>

				<p>这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,换行了<br />这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,<a href="http://ife.baidu.com">这里有一个连接连接到http://ife.baidu.com</a>这是一个很长的段落,这是一个很长的段落,<b>这里有个粗体字</b>这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,----
					<div><img src="img/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" /></div>
					这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,换行了--
					<br />这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,<a href="http://ife.baidu.com" target="_blank">这里有个连接,打开新窗口到百度</a>
				</p>
			</div>
			<div class="passage">
				<h2>这是另一篇文章的一级标题</h2>
				<h3>这是以另一篇文章的二级标题</h3>
				<p>文章作者 文章发表时间</p>
				<p>这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,换行了<br />这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,换行了<br />
					<a href="http://ife.baidu.com">这里有一个连接连接到http://ife.baidu.com</a>这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,这是一个很长的段落,
					<div>
						<img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" />
						<ul>
							<li>列表项目一</li>
							<li>列表项目二</li>
							<li>列表项目三</li>
						</ul>
					</div>
					<dl>
						<dt><h3>图片</h3></dt>
						<dd>
							<div>好看的图片</div><img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" alt="这是图片" />
							<div>好看的图片</div><img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" alt="这是图片" />
							<div>好看的图片</div><img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" alt="这是图片" />
							<div>好看的图片</div><img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" alt="这是图片" />
							<div>好看的图片</div><img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" alt="这是图片" />
							<div>好看的图片</div><img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" alt="这是图片" />
							<div>好看的图片</div><img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" alt="这是图片" />
							<div>好看的图片</div><img src="img/a1/CCP3Q5M`(N2DJ6_W$J9VTXQ.png" alt="这是图片" />
						</dd>
					</dl>
				</p>
			</div>
			<div class="passage">
				<h2>最后一篇文章一级标题</h2>
				<h2>文章二级标题</h2>
				<p>文章作者 文章发表时间</p>
				<ol>
					<li>排名1</li>
					<li>排名2</li>
					<li>排名3</li>
				</ol>
				<p>下面是一个表格,给表格增加了一个border="1"好让你看出是一个表格</p>
				<table border="1">
					<th>表头</th>
					<th>表头</th>
					<th>表头</th>
					<tr>
						<td>表内容单元格</td>
						<td>表内容单元格</td>
						<td>操作</td>
					</tr>
					<tr>
						<td>表内容单元格</td>
						<td>表内容单元格</td>
						<td>操作</td>
					</tr>
					<tr>
						<td>表内容单元格</td>
						<td>表内容单元格</td>
						<td>操作</td>
					</tr>
					<tr>
						<td>表内容单元格</td>
						<td>表内容单元格</td>
						<td>操作</td>
					</tr>
					<tr>
						<td>总计</td>
						<td colspan="2">1000</td>
					</tr>
				</table>
			</div>
			<br />
		</div>
		<div id="layer3">
			<h2>这里以后是一个侧栏,这里的侧栏的标题</h2>
			<h2>侧栏注册窗口标题</h2>
			<form>
				<p>请输入邮箱地址: <input type="text"></p>
				<p>邮箱地址请按要求输入</p>
				<p>请输入密码: <input type="text">请重复输入密码: <input type="text"></p>
				<p>密码为16位英文数字</p>
				<div>
					<span id="">
					性别: <input type="radio" name="xingbie" value="男"  />男<input type="radio" name="xingbie"  value="女" />女
				</span>
					<span>
					城市: <select>
						<option value="beijing">北京</option>
						<option value="beijing">北京</option>
						<option value="beijing">北京</option>
					</select>
				</span>
					<input type="checkbox" name="运动" />运动<input type="checkbox" value="艺术" />艺术<input type="checkbox" value="科学" />科学 个人描述:
					<textarea rows="3" cols="20"></textarea><input type="submit" value="确认提交" />
				</div>
				<div>
					版权所有 &copy;
				</div>
			</form>
		</div>
	</body>

</html>